<template>
    <div class="containt">
        <!-- 轮播图区域 -->
        <swipe-box></swipe-box>
        <!-- 九宫格 到 6宫格的改造过程 -->
        <div class="mui-content">
		        <ul class="mui-table-view mui-grid-view mui-grid-9">
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4"><router-link to="/home/newshome">
                            <img src="/images/新闻资讯.png" alt="">
		                    <div class="mui-media-body">新闻资讯</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4"><router-link to="/home/photolist">
		                    <img src="/images/图片分享.png" alt="">
		                    <div class="mui-media-body">图片分享</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4"><router-link to="/home/goodlist">
		                    <img src="/images/商品.png" alt="">
		                    <div class="mui-media-body">商品购买</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4"><router-link to="">
		                    <img src="/images/留言反馈.png" alt="">
		                    <div class="mui-media-body">留言反馈</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4"><router-link to="">
		                    <img src="/images/视频专区.png" alt="">
		                    <div class="mui-media-body">视频专区</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-4"><router-link to="">
		                    <img src="/images/联系我们.png" alt="">
		                    <div class="mui-media-body">联系我们</div></router-link></li>
		        </ul> 
		</div>
    </div>
</template>

<script>
import { Toast } from 'mint-ui';
import swipe from '../subcomponents/swipe.vue'
export default {
    components:{//用来注册子组件的
        "swipe-box":swipe
    }
}
</script>

<script>
// export default{
	// data(){
	// 	return {
	// 		lunbotuList:[]
	// 	}
    // },
    
	// methods: {
	// 	getLunbotu(){
	// 		this.$http.get('http://vue.studyit.io/api/getlunbo').then(result =>{
	// 			// console.log(result.body)
	// 			if(result.body.status ===0 ){
	// 				// 成功了
    //                 this.lunbotuList = result.body.message
    //                 Toast('加载轮播图ok');
	// 			}else{
	// 				// 失败的
	// 				Toast('加载轮播图失败');
	// 			}
	// 		})
	// 	}
	// },
	// created() {
	// 	this.getLunbotu()
    // },

 
// }
</script>

<style lang="scss" scoped>
.mui-grid-view{
    padding:0;
    img{
        border-radius:10px;
        width:40px;
        height:40px;
        &::before{
            color: #fff;
            font-weight: 800;
        }
    }
}

body{
    background:rgb(102, 255, 0)
}
</style>